<template>
	<view class="box">
		<u-empty    v-if="list.length==0&&status!='loadmore'"   text="无历史派单"    icon="https://cdn.uviewui.com/uview/empty/history.png">
		</u-empty>
		<view v-else class="content2" v-for="(item, index) in list" @click="navigateTo(item.id)">
			<u-row customStyle="margin-bottom:0px">
			    <u-col span="7">
			        <view class="demo-left" >
			        	预:<span >{{item.appointmentTime}} </span><!-- <span style="margin-left: 10px;">11km </span> -->
					</view>
			    </u-col>
				<u-col span="3">
					<view >
						<view class="typeName">
							{{item.serveName}}
						</view>
					</view>
				</u-col>
			    <u-col span="2">
			        <view class="demo-right" >
			        	<span>{{(item.totalPrice/100).toFixed(2)}}元</span>
			        </view>
					<uview-ui>
						<u-divider></u-divider>
						<span></span>
					</uview-ui>
			    </u-col>
			</u-row>
			<u-steps  direction="column" dot activeColor="#ffd02b" inactiveColor="#00ac4e">
				<u-steps-item :title="item.userAddress" :desc="item.address">
				</u-steps-item>
			</u-steps>  
		    <view class="stau">
				<p style="color: red;" v-if="item.receiveStatus=='5'">拒绝</p>
				<p   v-else>接单</p>
			</view>
		</view>	
		<u-loadmore :status="status" v-if="list.length!=0"/>
		
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex'; 
	export default {
		data() {
			return {
				status: 'loadmore',//上滑加载函数
				details:"/pagesB/serviceList/details",
				pageVO:{
					pageNo: 1,
					pageSize: 10,
					technicianId:"", 
					adminOrderType:'0,1,2',//平台派单（0未派单、1门店派单、2技师派单,3发布抢单、）
					receiveStatus:"2,3,4,5,6",//技师接单状态（1未接单，2已接单，3服务中，4已完成，拒绝接单，6取消）
					//orderStatus:1,//订单状态:1未接单 、2已接单、3服务中、4已经完成、5拒绝、6取消 
					sort:"desc",//排序
				},
				list:[],
			}
		},
		computed:{
			//获取是否登录
			...mapState(['hasLogin','userInfo']) 
		},
		mounted() {
			//获取当前位置 需用户授权
			//this.getCurrentLocal()
			//this.julijiusan();
			console.log("1111111")
		},
		onShow() {
			//获取当前位置
			this.showPage()
		},
		methods: {
			//获取数据
			showPage(){
				this.pageVO.technicianId=this.userInfo.id
				this.request.getRequest(this.http.httpsLian.orderDispatchRecord,this.pageVO, true)
				.then(res => { 
					//console.log("sss："+JSON.stringify(res))
					if(res.code!=0 )return 
					if(res.data.list.length==0) {
					    this.status = 'nomore';
					    return
					}
					if(res.data.list.length<this.pageVO.pageSize) {
					    this.status = 'nomore';
					}
					if (this.pageVO.pageNo!= 1) {
						this.list = this.list.concat(res.data.list)
					} else {
						this.list=res.data.list
					} 
				}).catch(res => {
					uni.$u.toast("网络异常2")
				})
			},
			//上拉事件触发
			onReachBottom(){
				console.log('上拉事件触发');
				this.pageVO.pageNo+=1
				this.status = 'loading';
				this.showPage()
				this.$emit('onReachBottomZ')
			},
			// 页面下拉时触发，与 onLoad 等生命周期函数平级
			onPullDownRefresh() {
				console.log('页面下拉时触发');
				this.status = 'loadmore';
				//回复默认值
				this.list=[]
				this.pageVO.pageNo=1
				this.pageVO.pageSize=10
				this.showPage()
			    setTimeout(() => {
					// 操作完成时，必须结束下拉刷新，否则一直会有 loading 标志
					uni.stopPullDownRefresh();
				}, 1000);
			},
			//跳转
			navigateTo(ids){
				uni.navigateTo({
				   url: "/pagesB/serviceList/details?params="+encodeURIComponent(JSON.stringify({id:ids}))
				});
			},

		}
	}
</script>

<style lang="scss" scoped>
.box{
	padding: 10px;
}
.stau{
	text-align:right;
}
.content2{
	background-color: white;
	padding: 8px ;
	margin-bottom: 10px;
	border-radius: 4px;
	.demo-right {
		text-align: right;
		font-size: 22rpx !important;
	}
	.demo-left{
		color: $uni-text-color-placeholder;
	}
	.demo-left,.demo-right{
		font-size: 12px;
	}
	

	
}
.typeName{
	border-radius: 2px;
	background-color: #fefefe;
	font-size: 25rpx;
	padding: 7rpx;
	color:$Main-green-color;
	display: inline-block;
	position: relative;
	
}


</style>
